<template>
    <div>
        <h3>显示学生列表</h3>
        <h5>欢迎<span>{{ user.userdata.username }}</span>登录</h5>
        <a href="/login">登录</a>
        <table class="table">
         <thead>
            <tr>
                <th>编号</th>
                <th>学生姓名</th>
                <th>密码</th>
                <th>性别</th>
                <th>班级</th>
                <th>操作</th>
            </tr>
         </thead>
         <tbody>
            <tr v-for="d in showdata">
                <td>{{d.studentId}}</td>
                <td>{{d.studentName}}</td>
                <td>****</td>
                <td>{{d.sex==1?"男":"女"}}</td>
                <td>{{d.studentClass}}</td>
                <td>--</td>
            </tr>
         </tbody>
        </table>
        共{{ sum.count }}条
        共{{ sum.pagecount }}页
        每页显示{{ page.PageSize }}条
        当前第{{ page.PageIndex }}页
        <input type="button" value="首页" @click="index(1)">
        <input type="button" value="上一页" @click="index(2)">

        <input type="button" v-for="d in sum.pagecount" :value="d" @click="jumpindex(d)">

        <input type="button" value="下一页" @click="index(3)">
        <input type="button" value="尾页" @click="index(4)">
        <input type="number" v-model="page.PageIndex">
        <input type="button" value="跳转" @click="updindex">
        显示
        <select v-model="page.PageSize" @change="updsize">
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="5">5</option>
        </select>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { ref,onMounted } from 'vue';
import { UserStore } from '@/stores/user';
import router from '@/router';
const user=UserStore()

onMounted(()=>{
    if(user.userdata.islogin==false)
{
    router.push('/login')
}
   showstu()
})

const page=ref({
    PageIndex:1,
    PageSize:2
})
const sum=ref({
    count:0,
    pagecount:0
})
const showdata=ref([{
      "studentId": 1,
      "studentName": "赵匡胤",
      "studentPwd": "1",
      "sex": 1,
      "studentClass": "202501A",
      "isDel": false,
      "createUserId": 0,
      "createTime": "2025-06-05T20:15:34.1310782",
      "deleteUserId": 0,
      "deleteTime": null,
      "updateUserId": 0,
      "updateTime": null
}])

const showstu=()=>{
    axios.get('/api/Student/ShowStudent',{params:page.value}).then(res=>{
    showdata.value=res.data.data
    sum.value.count=res.data.count
    sum.value.pagecount=Math.ceil(sum.value.count/page.value.PageSize)
    })
}
//首尾上下
const index=(val:number)=>{
   if(val==1)
   {
    page.value.PageIndex=1;
    showstu()
   }
    if(val==2&&page.value.PageIndex>1)
   {
    page.value.PageIndex--;
    showstu()
   }
   if(val==3&&page.value.PageIndex<sum.value.pagecount)
   {
    page.value.PageIndex++;
    showstu()
   }
   if(val==4)
   {
    page.value.PageIndex=sum.value.pagecount;
    showstu()
   }
}
//数字
const jumpindex=(val:number)=>{
    page.value.PageIndex=val;
    showstu()
}

const updindex=()=>{
    if(page.value.PageIndex<1||page.value.PageIndex>sum.value.pagecount)
{
    alert('页面超出范围')
    page.value.PageIndex=1
}
  showstu()
}
const updsize=()=>{
    page.value.PageIndex=1
    showstu()
}
</script>

<style scoped>

</style>